<%-- 
    Document   : home_content
    Created on : Oct 28, 2012, 9:22:41 AM
    Author     : Hien-0912141
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<script src="/scripts/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="/scripts/jquery.elastislide.js" type="text/javascript"></script>
<link href="/css/elastislide.css" rel="stylesheet" type="text/css" />
<%@ taglib prefix="c" 
uri="http://java.sun.com/jsp/jstl/core"%>

<noscript>
    <style>
        .es-carousel ul{
            display:block;
        }
    </style>
</noscript>

<div id="main-content">
    <div id="carousel" class="es-carousel-wrapper">
        <div class="es-carousel">
            <ul>
                <p> <c:out value="${requestScope.listProduct[0].productname}"/> </p>
                <li><a href="#"><img src="../../images/elastislide/large/1.jpg" alt="image01" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/10.jpg" alt="image02" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/3.jpg" alt="image03" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/4.jpg" alt="image04" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/5.jpg" alt="image05" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/6.jpg" alt="image06" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/7.jpg" alt="image07" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/8.jpg" alt="image08" /></a></li>
                <li><a href="#"><img src="../../images/elastislide/large/9.jpg" alt="image09" /></a></li>
            </ul>
        </div>
    </div>
</div>
<script type="text/javascript">
			
    $('#carousel').elastislide({
        imageW 	: 90,
        minItems	: 5
    });
			
</script>